<div class="col-12 col-md-6 mb-3">
    <div class="card" {{ sylius_test_html_attribute('scopes') }}>
        <div class="card-header">
            <div class="card-title">
                {{ 'sylius.ui.scopes'|trans }}
            </div>
        </div>
        <div class="card-body">
            <div class="row align-items-center">
                {{ form_row(hookable_metadata.context.form.scopes, {label: false}) }}

                {% hook 'scopes' %}
            </div>
        </div>
        <div class="card-footer">
            {{ form_row(hookable_metadata.context.form.scopes.vars.button_add) }}
        </div>
    </div>
</div>
